/*
    Appointment
*/
/*Calendar*/
.span3 .ui-datepicker{
    width: 16em;
}
a{
    outline:none !important;	
}
#external-events{
    display:none;
    position:absolute;
    left:auto;
    top:auto;
    top:0px !important;
    right:0px !important;
    z-index:888;
}
/*popover*/
.popover{
    text-align: center;
}
.popover-content .btn{
    width: 150px;
    margin-bottom: 5px;
}
.popover-title{
    font-weight: bold;
}

/*right panel Calendar*/
#right-panel{
    position: absolute;
    float: right;
    background-color: #fff;
    top: 116px;
    right: 27px;
    height: 81%;
    z-index: 1050;
    border: 1px solid #9f9f9f;
}
#right-panel input,select,textarea{
    font-size: 13px!important;
}
#right-panel label{
    display: inline-block;
    margin-right: 5px;
    width: 25%;
    margin-left: 23px;
}
#right-panel h3,#right-panel h4{
    line-height: 17px;
    color: #fff;
    font-weight: bold;
}
#right-panel h4{
    line-height:0;
}
#right-panel button{
    margin-top:0;
}
#right-panel .span4{
    margin-left: -12px;
    width: 36%;
}
#right-panel .span4 .modal-header{
    height: 17px;
}
#right-panel .control-group{
    margin-bottom: 0!important;
}
#right-panel .modal-header{
    background-color: #26bbf1;
    background-image: -moz-linear-gradient(top, #92dbf5 0%, #03afef 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #92dbf5), color-stop(100%, #03afef));
}
#right-panel .modal-footer{
    margin-top: 22px;
    height: 0px;
    background-color: #FFF;
}
#right-panel .phonetype{
    width: 22%;
}
#right-panel .input-mini{
    width: 10%;
}
#right-panel .input-small{
    width: 95px;
}
#right-panel label.confim{
    width: 80%;
}
#right-panel input[type="checkbox"]{
    margin-top: -1px;
}

#right-panel .modal-body{
    max-height: 468px!important;    
}
#right-panel #Cusname{
    font-weight: bold;
}
#right-panel #Cusemail{
    font-weight: 100;
}
#right-panel #user-status{
    color: #fa7408;
    font-style: italic;
}
/*event Calendar*/
.event-description{
    font-weight: 100;
}
.fc-event-status{
    margin-left: 17px;
    font-size: 13px;
}
.fc-event-status.icon-check{
    color: #52CC22;
    position: absolute;
    right: 1px;
    top: 3px;
}
.fc-event-status.icon-thumbs-up{
    color: #EB7B0E;
}
.fc-event-appt{
    background-color: #f5c03a;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #f5c03a));
}
.fc-event-room{
    background-color: #999;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #999))
}
.fc-event-block{
    background-color: #eee;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(50%, #eee));
}
.room-size{
    position: absolute;
    bottom: 2px;
    left: 5px;
    color: #fff;
}
/*Click slot in calendar*/
#Calendar{
    position: relative;
}
.fc-select-helper{
    z-index: 7!important;
}
#booking_box{
    display: none;
    position: absolute;
    border: #ccc solid 1px;
    border-radius: 4px;
    background: #FDFAFA;
    z-index: 99;
}
.box_booking{
    margin-bottom: 10px;
    width: 100% !important;
}
.message{
    color: #999;
    font-size: 11px;
    font-style: italic;
    padding-left: 58px;
    background: url('../img/customer-arrow.png') left center no-repeat;
    width: 105px;
    margin: 0 auto;
}
/*.customer-info{
    display: none;
}*/
.span12 .modal-body{
    overflow-y: hidden;
}
.wrap-message{
    width:80%;	
}
.ms-character{
    margin-left:5px;	
}
.message-area{
    width:100%;
    height:50px;	
    max-height:50px;
    clear:both;
    float:left;
}
label{
    cursor:default;
}
.row-email{
    width:98%;
    margin-left:1%;	
}
.box-email{
    width:98%;
    margin-bottom:3px;	
}
.box-email .box-content{
    display:none;	
}
.control-group.error{
    color: #b94a48;
}
.control-group.error .errorMessage{
    margin-left: 136px;
}
.status-roster{
    width: 90%;
    margin-left: 14px;
    padding-left: 10px
}
#right-panel .status-roster h3{
    color: #000;
}
.cls-relative{
    position:relative;	
}
.calendar-box{
    position:relative;	
}
.transparent-layout{
    position:absolute;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    z-index:9;
    background:#999;
    opacity:0.3;
}
.calendar-box .span3 .ui-datepicker{
    width:100%;
}	
#form_input{
    position:absolute;
    z-index:10;
    top:36px;
    right:0px;	
}
.form-input{
    min-height:1990px;	
}
.form-room-infor{

}
.form-input-data{
    padding:10px 15px;	
}
#form_input .checkbox.inline{
    padding-top:0px;
}
.icon-email{
    padding-top:0px;	
    padding-bottom:10px;
}
#form_input input[type="text"], #form_input input[type="datetime"], #form_input input[type="tel"], #form_input select{
    margin-bottom:0px;	
}
#form_input .form-horizontal label{
    width:70px;
    text-align:left;
}
#form_input .form-horizontal .controls{
    margin-left:80px;	
}
.close-form-btn{
    margin-right:5px;	
}
.repeat-group .radio input[type="radio"], .repeat-group .checkbox input[type="checkbox"], .mark-as{
    margin-left:0px;
}
.repeat-group .radio.inline + .radio.inline, .repeat-group .checkbox.inline + .checkbox.inline, .mark-as{
    margin-left:0px;	
}
.repeat-group .radio, .repeat-group .checkbox, .mark-as{
    padding-left:0px;	
}
.repeat-group label{
    width:60px !important;	
}
.repeat-group label.radio, .mark-as{
    width:100% !important;
}
#appoint_date, #room_date, #room_repeat_endby, #room_repeat_endby_1, #block_date{
    cursor:pointer;	
}

/*=========[ Calendar ]================================*/
.booking_box .btn{

}
.appoint-filter{
    position:absolute;	
    top:40px;
    left:10px;
    z-index:2;
}
.appoint-filter select{
    width:140px;
    margin-right:5px;
    max-height:28px;
    outline:none;
}

/*=========[ Calendar Event ]==========================*/

.fc-event{
    background:#72B0E9;
    border:none;
    border-radius:0px;
    cursor:pointer;
}
.fc-event:hover{
    background:#1E8FC6;		
}
.fc-event-title{
    color:#FFF;	
}
.fc-event:hover .fc-event-time{
    background:#3366CC;	
}
.fc-event-vert .fc-event-time{
    background:#1E8FC6;
    color:#FFF;	
    padding:3px;
}
.fc-event-vert.fc-event-start, .fc-event-vert.fc-event-end{
    border-left:1px solid #FFF;
    border-radius:0px;	
}
.fc-event-time, .fc-event-title{
    padding:0 3px;	
}
#Calendar .popover, .popover-title{
    border-radius:0px !important;	
}
.block-evt{
    background:#F17773;	
}
.block-evt:hover{
    background:#EE5F5B;	
}
.block-evt .fc-event-time{
    background:#EE5F5B;
}
.block-evt:hover .fc-event-time{
    background:#E63A3A;
}
.room-evt{
    background:#79CD79;		
}
.room-evt:hover{
    background:#62C462;		
}
.room-evt .fc-event-time{
    background:#62C462;
}
.room-evt:hover .fc-event-time{
    background:#339933;
}
.text-small{
    font-weight:100;
    font-size:11px;	
}
.event-icon{
    text-align:right;
    max-height:10px;	
}
.appoint-evt-invert, .room-evt-invert, .block-evt-invert{
    background:#CCC;
}
.appoint-evt-bookonline{
    background:#FF92B4;
}
.appoint-evt-bookonline .fc-event-time{
    background:#FF75A0;
}
.appoint-evt-bookonline:hover .fc-event-time{
    background:#F94D83;	
}
.appoint-evt-bookonline:hover .fc-event-inner{
    background: #FE709C;
}

.appoint-evt-hotdeals{
    background:#FABF3D;
}
.appoint-evt-hotdeals .fc-event-time{
    background:#FAAA3D;
}
.appoint-evt-hotdeals:hover .fc-event-time{
    background:#FE9A3A;	
}
.appoint-evt-hotdeals:hover .fc-event-inner{
    background: #FAAA3D;
}

.appoint-evt-redeemed{
	background:#FABF3D;	
}
.appoint-evt-redeemed .fc-event-time{
    background:#AAAAAA;
}
.appoint-evt-redeemed:hover .fc-event-time{
    background:#AAAAAA;	
}
.appoint-evt-redeemed:hover .fc-event-inner{
    background:#FABF3D;	
}

.request-evt{
    background:#74C9B9;		
}
.request-evt:hover{
    background:#74D1B9;		
}
.request-evt .fc-event-time{
    background:#1FC1A9;
}
.request-evt:hover .fc-event-time{
    background:#11B1A9;
}

.request-evt-invert .fc-event-time, .request-evt-invert:hover .fc-event-time{
    background:#AAA;
}
.request-evt-invert{
    background:#CCC;
}
.request-evt-invert:hover{
    background:#74D1B9;
}

.appoint-evt-invert .fc-event-time, .room-evt-invert .fc-event-time, .block-evt-invert .fc-event-time{
    background:#AAA !important;
}
.appoint-evt-bookonline-invert:hover .fc-event-inner{
    background:#FF92B4 !important;
    /*color:#000;*/
}
.form-input-data label.radio{
    margin-bottom:5px;
    float:left;	
}
.ui-resizable-handle{
    display:none !important;
}

/*=========[ Event Caption ]==========================*/

.event-ct-wr{
    float:left;
    clear:both;
    margin-bottom:10px;
}
.event-caption{
    float:left;
    font-size:8px;
    color:#FFF;
}
.event-caption .evt-top{
    width:45px;
    height:20px;
    padding-left:2px;
}
.event-caption .evt-bottom{
    width:45px;
    height:30px;
    padding-left:2px;
}
.caption-desc{
    float:left;
    padding-left:10px;
    font-size:12px;
}
.event-caption-apt .evt-top{
    background:#1E8FC6;
}
.event-caption-apt .evt-bottom{
    background: #72B0E9;
}
.event-caption-apt:hover .evt-top{
    background:#3366CC;
}
.event-caption-apt:hover .evt-bottom{
    background: #56ABD4;
}

.event-caption-apt-online .evt-top{
    background:#FF75A0;
}
.event-caption-apt-online .evt-bottom{
    background:#FF92B4;
}
.event-caption-apt-online:hover .evt-top{
    background:#F94D83;
}
.event-caption-apt-online:hover .evt-bottom{
    background:#FE709C;
}

.event-caption-apt-request .evt-top{
    background:#1FC1A9;
}
.event-caption-apt-request .evt-bottom{
    background:#74C9B9;
}
.event-caption-apt-request:hover .evt-top{
    background:#11B1A9;
}
.event-caption-apt-request:hover .evt-bottom{
    background:#74D1B9;
}

.event-caption-apt-invert .evt-top{
    background:#AAA;
}
.event-caption-apt-invert .evt-bottom{
    background:#CCC;
}
.event-caption-apt-invert:hover .evt-bottom{
    background:#56ABD4;
}

.event-caption-room .evt-top{
    background:#62C462;
}
.event-caption-room .evt-bottom{
    background:#79CD79;
}
.event-caption-room:hover .evt-top{
    background:#339933;
}
.event-caption-room:hover .evt-bottom{
    background:#89D389;
}
.event-caption-room-invert .evt-top{
    background:#AAA;
}
.event-caption-room-invert .evt-bottom{
    background:#CCC;
}
.event-caption-room-invert:hover .evt-bottom{
    background:#89D389;
}
.event-caption-block .evt-top{
    background:#EE5F5B;
}
.event-caption-block .evt-bottom{
    background:#F17773;
}
.event-caption-block:hover .evt-top{
    background:#E63A3A;
}
.event-caption-block:hover .evt-bottom{
    background:#F28784;
}
.event-caption-block-invert .evt-top{
    background:#AAA;
}
.event-caption-block-invert .evt-bottom{
    background:#CCC;
}
.event-caption-block-invert:hover .evt-bottom{
    background:#F28784;
}
.chart-note{
    color: #383e4b;
}

.event-caption-hotdeal .evt-top{
    background:#FAAA3F;
}
.event-caption-hotdeal:hover .evt-top{
    background:#FE9A3A;
}
.event-caption-hotdeal .evt-bottom{
    background:#FABF3F;
}
.event-caption-hotdeal:hover .evt-bottom{
    background:#FAAA3F;
}
.event-caption-hotdeal-invert .evt-top{
    background:#AAA;
}
.event-caption-hotdeal-invert .evt-bottom{
    background:#FABF3F;
}
.event-caption-hotdeal-invert:hover .evt-bottom{
    background:#FAAA3F;
}

/*=========[ Room Roster ]==========================*/

.room-informations{
    background:#DFF0D8;
    color:#468847;
    margin-bottom:10px;
}
.room-informations label{
    font-size:12px;
    height:16px;	
}
.room-informations .notification{
    position:inherit;
    margin-top:-3px;	
    margin-right:5px;
}
.room-roster{
    min-height:1100px;	
}
.room-roster .progress{
    margin-top:13px;
    border-radius:0px !important;	
}
.block-padding{
    padding:0 10px;	
}
.table-roster-header{
    margin-bottom:0px;	
}
.box-roster{
    padding-top:0px !important;	
    position:relative;
}
.roster-list{
    max-height:388px; 
    overflow:scroll; 
    overflow-x:hidden;
}
#roster_list{
    width:100%;	
}
.box-roster table th:first-child, .roster-list table tr td:first-child{
    width:40%;
}
.box-roster table th:last-child, .roster-list table tr td:last-child{
    width:40%;	
}
.bg-loading{
    position:absolute;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    background-image:url(../../img/loading.gif);
    background-position:center center;
    background-repeat:no-repeat; 
}
.bg-loading-1{
    position:absolute;
    width:100%;
    height:100%;
    background-color:#EFEFEF;
    top:0px;
    left:0px;
    background-image:url(../../img/loading.gif);
    background-position:center 100px;
    background-repeat:no-repeat; 
}
.bg-loading, .bg-loading-1{
    display:none;	
}
.icon-center{
    margin-left:24px;	
}
.roster-icon{
    width:24%;
    min-height:10px;
    float:left;
    clear:none;
    text-align:right;	
}
.icon-checkin{
    color:#5DB734;
    cursor:pointer;	
}
.icon-checkout{
    cursor:pointer;	
}
.icon-view-appoint{
    cursor:pointer;	
}
.icon-delete{
    color:#FF2121;
    cursor:pointer;		
}
.money-unit{
    font-size:24px;
    text-align:center;	
}
.icon-center{
    cursor:default;	
}
.roster-cus-detail{
    min-height:183px;
    max-height:183px;
    overflow:hidden;
    background:#F1F1F1 !important;	
    position:relative;
}
.roster-cus-detail-box{
    height:230px; 
    margin-bottom:20px;
}
.roster-cus-img{
    float:left;
    width:60px;
    height:60px;
    margin:5px;
    border:1px solid #AAA;	
}
.roster-cus-info{
    float:right;
    margin:5px;	
}
.roster-cus-detail-box td{
    vertical-align:top;	
}
/*=========[ View Appointment ]==========================*/

.view-appointment .form-horizontal .control-group{
    margin-bottom:0px;	
}
.view-appointment .form-horizontal .control-group div.controls{
    padding-top:5px;	
}
.view-appointment .form-horizontal .control-group div.controls-email{
    padding-top:0px;	
}
.appoint-cus-detail{
    min-height:1345px;	
    background:#EFEFEF !important;
    position:relative;
}
.appointment-cus-info{
    float:left;
    clear:both;	
}
ul#infoTab{
    float:left;
    clear:both;
    margin-top:50px;	
}
ul#infoTab li{
    float:left !important;
    min-width:40px;
    margin-right:20px;
}
ul#infoTab li a{
    outline:none !important;
    font-size:12px !important;
}
ul#infoTab li a i{
    font-size:14px;	
}
#myTabContent{
    float:left;
    clear:both;	
}
ul#infoTab li .quick-button{
    background:#1E8FC6;	
}
ul#infoTab li.active .quick-button{
    background:#FFF;	
}

/*=========[ Suggest Customer List ]=======================*/

.suggest-field{
    position:relative;
}
ul.suggest-list{
    position:absolute;
    top:26px;
    left:0px;
    list-style:none;
    margin:0px;
    z-index:9999;
	width:200px;
    box-shadow:0 0 3px #999;
}
ul.suggest-list li{
    float:left;
    clear:both;
    padding:2px 2.5%;
    width:95%;
    cursor:pointer;
    background:#FFF;	
	border-bottom:1px solid #DDD;
}
ul.suggest-list li:hover{
    background:#36A9E1;	
    color:#FFF;
}
ul.suggest-list li:hover .sub-text{
	color:#FFF;	
}
.undo-cus-suggest{
    color:#F9AA0B;
    position:absolute;
    right:-20px;
    top:8px;
    cursor:pointer;
    display:none;
}

/*=========[ Customer Details ]=======================*/
.cusdetail-note{
    float:right;	
}
#myTabContent{
    width:100%;	
}
ul.appoint-list{
    margin:0px;
    list-style:none;	
}
.wrap-appoint-list{
    width:100%;
    max-height:570px;
    float:left;	
}
.wrap-note-list{
    float:left;
    margin-top:5px;
    width:100%;
    max-height:445px;
    overflow-x:hidden;
    overflow-y:auto;
    float:left;		
}
ul.appoint-list li.span12{
    float:left;
    clear:both;
    padding:10px 5px;	
    border-top:1px solid #AAA;
    margin:0px !important;
}
.new-user-noti{
    color:#FABB3D;	
}

/*=========[ List Event ]=======================*/
.event-list td{
    width:12.5%;	
}
table .appoint, table .room{
    font-size:12px;
    margin-bottom:20px;
    padding-bottom:20px;
    border-bottom:1px solid #DDD;
    min-height:140px;
}	
td .appoint:last-child, td .room:last-child{
    padding-bottom:0px;
    border-bottom:none;	
}
.text-blue{
    color:#36A9E1;	
}
.text-green{
    color:#5DB734;	
}
.text-red{
    color:#E63A3A;	
}
#list_events tr td{
    font-size:12px;	
}
.date-filter{
    float:left;
    width:360px;	
}
#filter_form select{
    max-width:140px;
    margin-right:5px;	
}
#le_start_date, #le_end_date{
    max-width:120px;	
}
.btn-filter{
    margin-top:-10px;	
}
table.event-list th, table.event-list td{
    width:12.5% !important;
}
table.event-list th{
    background: #F5F5F5;
}

/*---------- Popover --------------------*/
.appoint .popover, .room .popover{
    max-width:600px !important;	
}
.appoint .pop-over, .room .pop-over{
    cursor:pointer;	
}
.pop-wrap{
    width:525px;	
}
.pop-title{
    float:left;
    clear:both;
    margin-bottom:6px;	
    margin-right:5px;
    width:120px;
    text-align:left;
}
.pop-vl{
    float:left;
    font-weight:bold;
    margin-bottom:6px;
    text-align:left;
}

/*------------ Staff View --------------*/
.staff-view{
	display:flex;
	width:auto;
	overflow-x:auto;
	min-height:1480px;
	padding-top:40px;
}
.staff-calendar{
	width:220px;
	float:left;	
	min-width:220px;
}
.staff-view #Calendar_staff_0{
	width:250px !important;	
}
.staff-view .fc-agenda .fc-agenda-axis{
	display:none;	
}
.staff-view .staff-calendar:first-child .fc-agenda .fc-agenda-axis{
	display:table-cell;	
}
#btn-calendar-view-staff.active i, #btn-calendar-view-week.active i{
	opacity:1;
	background:#FFF;
	color:#1E8FC6;	
}
.staff-view .fc-header-title{
	visibility:hidden;	
}
.staff-view #Calendar_staff_0 .fc-header-title{
	visibility:visible;
}
.sub-text{
	font-size:12px;
	font-style:italic;
	color:#666;	
}
.redeem-area{
	float:left;
	width:100%;	
}
.input-redeem{
	width:50%;
	float:left;
	padding:1px 3px !important;	
}
#redeem_btn{
	float:right;
	width:40%;	
}
#redeem_btn_loading{
	display:none;
	float:right;
	width:40%;
	height:24px;	
	position:relative;
}